<template>
  <view class="content">
    <view class="header"
      ><image src="https://s3.ax1x.com/2021/01/04/sPPoKf.jpg" mode=""></image
    ></view>

    <view class="content11">
      <view>申请获取以下权限</view>
      <text>获得你的公开信息(昵称，头像等)</text>
    </view>

    <button
      class="bottom"
      type="primary"
      open-type="getUserInfo"
      lang="zh_CN"
      @getuserinfo="onGotUserInfo"
    >
      授权登录
    </button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      show: false,
    };
  },
  methods: {
    onGotUserInfo(e) {
      console.log("e :>> ", e);
      if (e.detail.errMsg === "getUserInfo:fail auth deny")
        return uni.$showMsg("您取消了授权！");

      this.getToken(e.detail);
    },
    async getToken(info) {
      console.log("info :>> ", info);
      const [err, res] = await uni.login().catch((err) => err);
      if (err || res.errMsg !== "login:ok") return uni.$showMsg("登录失败！");

      uni.setStorageSync("info", info);
      const data = await this.$u.get("api/wxapp/Public/regist", {
        code: res.code,
        encrypted_data: info.encryptedData,
        iv: info.iv,
      });

      if (data.code != 1) {
        console.log("data :>> ", data);
        return uni.$showMsg("用户登录失败！");
      }

      uni.setStorageSync("token", data.data.token);
      uni.setStorageSync("session_key", data.data.session_key);
      uni.setStorageSync("user", data.data.user);
      // reLaunch 重新启动

      uni.reLaunch({
        url: "../zhixun/zhixun",
      });

      if (data.code === 1) return uni.$showMsg("用户登录成功！");
    },
  },
};
</script>

<style lang="scss" scoped>
.content {
  width: 100vw;
  height: 100vh;
  background-color: #ffffff;
  overflow: hidden;
  .header {
    margin: 90rpx 0 90rpx 50rpx;
    // border-bottom: 1px solid #ccc;
    text-align: center;
    width: 650rpx;
    height: 300rpx;
    line-height: 450rpx;
  }

  .header image {
    width: 200rpx;
    height: 200rpx;
  }

  .content11 {
    margin-left: 50rpx;
    margin-bottom: 90rpx;
  }

  .content11 text {
    display: block;
    color: #9d9d9d;
    margin-top: 40rpx;
  }

  .bottom {
    border-radius: 80rpx;
    margin: 70rpx 50rpx;
    font-size: 35rpx;
  }
}
</style>
